import 'package:getx_demo/common/utils/utils.dart';
import 'package:getx_demo/common/values/values.dart';
import 'package:flutter/material.dart';
import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import '../index.dart';

final double margin = 32.w;

class LoginView extends GetView<LoginController> {
  const LoginView({super.key});

  @override
  Widget build(BuildContext context) {
    return KeyboardDismissOnTap(
      dismissOnCapturedTaps: true,
      child: Column(
        children: [
          _buildTopLog(),
          SizedBox(height: 39.h),
          _buildPhoneNumber(),
          SizedBox(height: 22.h),
          _buildPassword(),
          SizedBox(height: 58.h),
          _buildLoginBtn(),
          const SizedBox(height: 5),
          _forgetPwd(),
        ],
      ),
    );
  }

  Widget _buildTopLog() {
    return SizedBox(
      height: 247.h,
      child: Stack(
        alignment: AlignmentDirectional.center,
        children: [
          Image.asset(Assets.loginTop),
          Positioned(
            top: 98.h,
            child: SizedBox(
              width: 203.w,
              height: 81.w,
              child: Image.asset(Assets.loginUser),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildPassword() {
    return Container(
      margin: EdgeInsets.only(left: margin, right: margin),
      decoration: BoxDecoration(
        //设置四周圆角 角度
        borderRadius: const BorderRadius.all(Radius.circular(4.0)),
        //设置四周边框
        border: Border.all(width: 0.5, color: '#97A1B0'.toColor()),
      ),
      child: SizedBox(
        width: 309.w,
        height: 43.h,
        child: GetBuilder<LoginController>(
          builder: (_) {
            return TextField(
              controller: controller.pwdTextController,
              autofocus: false,
              obscureText: !controller.state.pwdIsVisible,
              textInputAction: TextInputAction.done,
              style: const TextStyle(color: Colors.black, fontSize: 14),
              decoration: InputDecoration(
                hintText: "请输入登录密码",
                border: InputBorder.none,
                hintStyle: const TextStyle(color: Colors.blue, fontSize: 14),
                prefixIcon: UnconstrainedBox(
                  child: Image.asset(
                    Assets.loginPwd,
                    width: 14,
                    height: 17,
                  ),
                ),
                suffixIcon: IconButton(
                  icon: Icon(
                    //根据passwordVisible状态显示不同的图标
                    !controller.state.pwdIsVisible
                        ? Icons.visibility
                        : Icons.visibility_off,
                    color: Colors.black12,
                  ),
                  onPressed: () => controller.switchPwdVisible(),
                ),
              ),
            );
          },
        ),
      ),
    );
  }

  Widget _buildPhoneNumber() {
    return Container(
      margin: EdgeInsets.only(left: margin, right: margin),
      decoration: BoxDecoration(
        //设置四周圆角 角度
        borderRadius: const BorderRadius.all(Radius.circular(4.0)),
        //设置四周边框
        border: Border.all(width: 0.5, color: '#97A1B0'.toColor()),
      ),
      child: SizedBox(
        height: 43,
        child: TextField(
          controller: controller.nameTextController,
          keyboardType: TextInputType.text,
          autofocus: false,
          textInputAction: TextInputAction.done,
          style: const TextStyle(color: Colors.black, fontSize: 14),
          decoration: InputDecoration(
            hintText: "请输入用户名称",
            border: InputBorder.none,
            hintStyle: const TextStyle(color: Colors.red, fontSize: 14),
            prefixIcon: UnconstrainedBox(
              child: Image.asset(
                Assets.loginUser,
                width: 18,
                height: 18,
              ),
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildLoginBtn() {
    return Container(
      margin: EdgeInsets.only(left: margin, right: margin),
      child: SizedBox(
        height: 44,
        child: DecoratedBox(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(22),
            gradient: LinearGradient(
              colors: [
                '#2194FF'.toColor(),
                '#1373FD'.toColor(),
              ],
            ),
          ),
          child: InkWell(
            onTap: controller.login,
            child: const Center(
              child: Text(
                '登 录',
                style: TextStyle(fontSize: 18, color: Colors.white),
              ),
            ),
          ),
        ),
      ),
    );
  }

  Widget _forgetPwd() {
    return Row(
      children: [
        const Spacer(),
        Padding(
          padding: EdgeInsets.fromLTRB(0, 0, 35.w, 0),
          child: TextButton(
            onPressed: controller.forgetPwd,
            child: Text(
              '忘记密码',
              style: TextStyle(fontSize: 11, color: '#0E67E7'.toColor()),
              textAlign: TextAlign.right,
            ),
          ),
        ),
      ],
    );
  }
}
